/* FONT */

@font-face {
    font-family: "Chopin Script";

    src: url("https://db.onlinewebfonts.com/t/66b53c5583db0de64a902b2ec6e311ea.woff2") format("woff2"),
         url("https://db.onlinewebfonts.com/t/66b53c5583db0de64a902b2ec6e311ea.woff") format("woff"),
         url("https://db.onlinewebfonts.com/t/66b53c5583db0de64a902b2ec6e311ea.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;

    font-family: "Riffic";
    src: url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.eot");
    src: url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.svg#Riffic")format("svg");

font-family: "Mongolian Baiti";
    src: url("https://db.onlinewebfonts.com/t/cb8d4d30de89efdc96a98761ede26d3d.eot");
    src: url("https://db.onlinewebfonts.com/t/cb8d4d30de89efdc96a98761ede26d3d.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/cb8d4d30de89efdc96a98761ede26d3d.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/cb8d4d30de89efdc96a98761ede26d3d.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/cb8d4d30de89efdc96a98761ede26d3d.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/cb8d4d30de89efdc96a98761ede26d3d.svg#Mongolian Baiti")format("svg");

    font-family: "Menlo Bold";
    src: url("https://db.onlinewebfonts.com/t/a6ffc5d72a96b65159e710ea6d258ba4.eot");
    src: url("https://db.onlinewebfonts.com/t/a6ffc5d72a96b65159e710ea6d258ba4.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/a6ffc5d72a96b65159e710ea6d258ba4.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/a6ffc5d72a96b65159e710ea6d258ba4.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/a6ffc5d72a96b65159e710ea6d258ba4.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/a6ffc5d72a96b65159e710ea6d258ba4.svg#Menlo Bold")format("svg");

        font-family: "Code New Roman";
    src: url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.eot");
    src: url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.svg#Code New Roman")format("svg");


}


/* RESET */

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* BODY */

body {
    background-color: #ffcc00;
    font-family: "Comic Sans MS", sans-serif;
    min-height: 100vh;
}

/* MAIN */

main {
    width: 100%;
    
    padding-left: 25%;
    padding-right: 25%;
    padding-top: 40px;
    padding-bottom: 120px;
}

/* TITOLONE */

#div1 {
    width: 100%;
    text-align: left;
    margin-bottom: 50px;
}


.heading1 {
    font-size: 82px;
    color: rgb(255, 0, 0);
    font-family: "Comic Sans MS";
        src: url("https://db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot");
        src: url("https://db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot?#iefix")format("embedded-opentype"),
        url("https://db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff2")format("woff2"),
        url("https://db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff")format("woff"),
        url("https://db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.ttf")format("truetype"),
        url("https://db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.svg#Comic Sans MS")format("svg");
    place-content: top;
    margin-left: -40%;
    margin-top: 0%;
 }

/* GRID */

.grid-container {
    display: flex;
    flex-direction: column;
    gap: 35px;
}

/* TESTI */

.project,
.foley, .freddy, .oscars, .turchese {
    font-size: 32px;
    text-align: center;
}

/* FONT SPECIALE */

.freddy {
    font-family: "Riffic";
    src: url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.eot");
    src: url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/82023538f68f7bb9cc6cd054af2a0aa8.svg#Riffic")format("svg");
    font-size: 32px;
}

.turchese {
        font-family: "Code New Roman";
    src: url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.eot");
    src: url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/472141eebd088aae9fa5192ddc13a083.svg#Code New Roman")format("svg");
    font-size: 32px;
}



.foley {
font-family: "Mongolian Baiti", cursive;
font-size: 32px;
}

/* LINKS */

a {
    text-decoration: none;
    color: black;
}

a:visited {
    color: black;
}

a:hover {
    background: -webkit-linear-gradient(#ff0055, #ff00ea);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* FOOTER */

.end_page {
    position: fixed;
    bottom: 0;
    left: 0;

    width: 100%;

    background-color: #ffcc00;

    text-align: center;

    padding: 15px;

    font-size: 18px;
}

/* MOBILE */

@media (max-width: 768px) {

    main {
        padding-left: 10%;
        padding-right: 10%;
    }

    .heading1 {
        font-size: 30px;
    }

    .project,
    .verzaschina {
        font-size: 24px;
    }

    .end_page {
        font-size: 14px;
    }
}